<template>
    <div class="box">
        <div class="header">
            <van-search v-model="value" show-action placeholder="请输入搜索关键词" @search="onSearch">
                <template #action>
                    <button
                        style="background-color: green; color: white;border-radius: 20px;width: 80px; border: 1px solid white;">打开APP</button>
                </template>
                <template #left>
                    <p style="color: green; font-size: 25px;font-weight: 700;">豆瓣</p>
                </template>
            </van-search>
        </div>
        <div class="meddle">

            <ul>
                
                    <img :src="obj.image" alt="">
                    <p>{{ obj.title }}</p>
                
            </ul>
                
        </div>
    </div>
</template>
<script setup>
import request from '@/utils/request.js'
import { ref, onMounted } from "vue";
const obj = ref([])
import { useRoute, useRouter } from 'vue-router'

const router = useRouter()
const route = useRoute()
onMounted(() => {
    request.get('/detail', {
        params: {
            id: route.params.id
        }
    }).then(res => {
        if (res.data.code == 200) {
            obj.value = res.data.data
        }
    })
})
</script>